<template>
	<div class="lc_wrap">
		<el-row id="agency">
			<el-col :span="24" class="table-wrapper">
				<!--<overlay @changeTreeBox="changeTreeBox"></overlay>-->
				<basic-container>
					<el-form :inline="true" class="demo-form-inline" size="small">
						<el-form-item label="采样时间">
							<el-date-picker style="width: 150px;" v-model="query.start" type="date" size="small" placeholder="开始日期" :picker-options="pickerOption" value-format="yyyy-MM-dd">
							</el-date-picker>
							&nbsp;至&nbsp;
							<el-date-picker style="width: 150px;" v-model="query.end" type="date" size="small" placeholder="结束日期" :picker-options="pickerOption" value-format="yyyy-MM-dd">
							</el-date-picker>
							&nbsp;&nbsp;
						</el-form-item>

            <el-form-item label="企业名称">
              <el-input placeholder="请输入企业名称" v-model="query.deptName"></el-input>
            </el-form-item>

						<el-form-item label="样品编号">
							<el-input v-model="query.sampleNum" placeholder="请输入样品编号"></el-input>
						</el-form-item>

						<el-form-item label="采样方式">
							<el-select size="small" v-model="query.samplingMethods" style="width: 150px;">
								<el-option v-for="(item, index) in samplingList" :key="index" :label="item.id" :value="item.value"></el-option>
							</el-select>
						</el-form-item>

						<el-form-item label="状态">
							<el-select size="small" v-model="query.testTodoStatus" style="width: 150px;">
								<el-option v-for="(item, index) in statusList" :key="index" :label="item.value" :value="item.id"></el-option>
							</el-select>
						</el-form-item>
						<!--搜索按钮-->
						<el-form-item label="" style="margin-left: 10px;">
							<el-button type="primary" size="small" icon="el-icon-search" @click="searchBtn">搜 索</el-button>
							<el-button type="" size="small" icon="el-icon-delete" @click="searchReset">清 空</el-button>
						</el-form-item>
					</el-form>

					<avue-crud :data="data" :option="option" :page.sync="page" :table-loading="loading" @current-change="currentChange" @refresh-change="refreshChange"
						@search-change="searchChange" @selection-change="selectionChange"
						ref="crud" v-model="form"
						@size-change="sizeChange" @search-reset="searchReset">
						<template slot="menuLeft">
							<el-button type="primary" size="small" v-if="permission.psoa32_analysis_send_notice" icon="el-icon-s-promotion" @click="send_notice">发送化验通知</el-button>
						</template>
						<template slot="nextStatus" slot-scope="scope">
							<el-tag type="warning" v-if="scope.row.nextStatus==1" size="small">待化验</el-tag>
							<el-tag size="small" type="danger" v-else>审核不通过</el-tag>
						</template>
					    <template slot-scope="scope" slot="menu">
					        <el-button icon="el-icon-magic-stick" v-if="scope.row.nextStatus==1" :size="scope.size" :type="scope.type" @click="agencyDialog(scope.row)">填写化验单</el-button>
					        <el-button icon="el-icon-document-checked" v-else :size="scope.size" :type="scope.type" @click="agencyDialog(scope.row)">重新提交</el-button>
					    </template>
					</avue-crud>

					<el-dialog title="化验报告" :visible.sync="showDialog" width="50%" :append-to-body="true" class="agencyDialog Dialog_title">
						<el-divider></el-divider>
						<avue-form :option="formOption" ref="form" v-model="formParams"
							@reset-change="emptytChange" @submit="submit">
						    <template slot-scope="scope" slot="menuForm">
						       <el-button @click="showDialog=false" icon="el-icon-close">取消</el-button>
						    </template>
							<template slot="sampleAuditRecordList" slot-scope="scope">
								<div class="block">
								  <el-timeline>
								    <el-timeline-item :timestamp="item.auditTime" placement="top" v-for="(item,index) in scope.value"  :key="index">
								      <el-card>
								        <div>{{item.reason}}</div>
								        <div>{{item.auditUserName}} 提交于 {{item.auditTime}}</div>
								      </el-card>
								    </el-timeline-item>
								  </el-timeline>
								</div>
							</template>
						</avue-form>
					</el-dialog>
				</basic-container>
			</el-col>
		</el-row>
	</div>
</template>
<script>
	import { getTestTodoList,getCollectionMethods,getTestTodoStatus,getTestTodoDetail,submitTestTodo } from "@/api/psoa32/analysis";
	import { getToken } from "@/util/auth";
	import lcTree from "@/components/common/tree.vue";
	import overlay from "@/components/common/overlay.vue";
	import mixmin from '@/config/mixmin'
	import {dateFormat} from "@/util/date";
	import { agency,agencyFormOption1,agencyFormOption2 } from "@/views/psoa32/analysis/column/column.js"
	export default {
		components: {
			lcTree,
			overlay
		},
		data() {
			return {
				showDialog: false,
				form: {},
				query: {
					sampleNum:'',
					endTime: '',
					samplingMethods: '0',
					startTime: '',
					testTodoStatus:'0',
          deptName:''
				},
				samplingList: null,
				statusList: null,
				loading: false,
				option: {
					addBtn: false,
					editBtn: false,
					delBtn: false,
					tip: false,
					searchShow: true,
					searchMenuSpan: 6,
					border: true,
					index: true,
					dialogClickModal: false,
					menu: true,
					column: agency
				},
				formParams:{},
				formOption:{
				  emptyBtn:false,
                  column: []
				},
				data: [],
				pickerOption: {
					firstDayOfWeek: 1,
					disabledDate(time) {
						return time.getTime() > Date.now()
					},
				},
				handelType:''
			}
		},
		mixins: [mixmin],
		mounted(){
      this.option.menu = this.vaildData(this.permission.psoa32_analysis_agency_handle, false),
        this.initSearch();
			this.onLoad();
		},
		methods: {
			submit(form,done,loading){
				let newArr=[]
				form.testReportList.forEach(item=>{
					let obj={
					  "isAbnormal": 0,
					  "sampleCollectionId": item.sampleCollectionId,
					  "testFactorCode": item.testFactorCode,
					  "testVal": 0,
					  "currentTestTime":form.testTime,
					  "testUserId":form.testUserId
					}
					for(var x in form) {
						if(item.testFactorCode== x) {
							obj.testVal = form[x]
						}
						if(item.testFactorCode+'isAbnormal'== x) {
							obj.isAbnormal = form[x]
						}
					}
					newArr.push(obj)
				})
				submitTestTodo(newArr).then(res=>{
					done()
					this.showDialog=false
					this.onLoad();
				},error=>{
					done()
				})
			},
			agencyDialog(obj){
				this.formOption.column=[]
				this.formParams={}
				this.formOption.column=agencyFormOption1
        let userList = this.findObject(this.formOption.column, "testUserId")
        this.$set(userList.dicQuery, "testDeptInfoId", obj.testDeptInfoId)
				// 请求化验单详情
				getTestTodoDetail(obj.id).then(res=>{
					let data=res.data.data
					let factorList=data.testReportList
					let arr=[]
					// 因子表单赋值
					factorList.forEach(el => {
						data[el.testFactorCode] = el.testVal
						data[el.testFactorCode+'isAbnormal'] = el.isAbnormal?el.isAbnormal:0
						arr.push({
							label: el.factorName,
							prop: el.testFactorCode,
							span: 12,
							disabled: false
						},{
							label: "是否超标",
							prop: el.testFactorCode+'isAbnormal',
							span: 12,
							disabled: false,
							type: "radio",
							dicData: [{
								label: '是',
								value: 1
							}, {
								label: '否',
								value: 0
							}]
						})
					})
					this.formOption.column=this.formOption.column.concat(arr,agencyFormOption2)
					const sampleAuditRecordList = this.findObject(this.formOption.column, 'sampleAuditRecordList')
					if(obj.nextStatus==1){
						this.$set(sampleAuditRecordList, 'display', false)
						this.handelType='first'
					}else{
						this.$set(sampleAuditRecordList, 'display', true)
						this.handelType='again'
					}
					this.formParams=data
					if(!this.formParams.testTime){
						this.formParams.testTime=dateFormat(new Date(), 'yyyy-MM-dd hh:mm:ss')
					}
				}).then(()=>{
          this.showDialog=true
        })

			},
			// 初始化操作搜索栏
			initSearch(){
				getTestTodoStatus().then(res=>{
					this.statusList=res.data.data
				})
				getCollectionMethods().then(res=>{
					this.samplingList=res.data.data
				})
			},
			//自定义搜索清空事件
			searchReset() {
				this.query={
					sampleNum:'',
					endTime: '',
					samplingMethods: '0',
					startTime: '',
					testTodoStatus:'0'
				},
				this.page.currentPage = 1
				this.onLoad();
			},
			// 发送通知
			send_notice(){
				this.$message.success('发送成功')
			},
			searchBtn() {
				this.page.currentPage = 1
				this.onLoad()
			},
			onLoad() {
				this.loading = true;
		        let params = Object.assign({}, this.query, {
		          current: this.page.currentPage,
		          size: this.page.pageSize
		        })
				getTestTodoList(params).then(res => {
					this.data = res.data.data.records
					this.page.total =res.data.data.total
					this.loading = false;
				})
			}
		}
	};
</script>


<style lang="scss">
	.agencyDialog{
		.el-timeline{padding-left: 0px;padding-top: 10px;}
		.el-timeline-item__content{
			.el-card__body{padding:5 15px!important;}
		}
		.el-card{border: 1px solid #ebeef5!important;}
		.el-card.is-always-shadow{box-shadow: 0 2px 12px 0 rgba(0, 0, 0, .1);}
	}
</style>

<style lang="scss" scoped>
	.box {
		height: 100%;
		margin-bottom: 0;
	}

	.el-row {
		height: calc(100% - 20px);
	}

	.el-col {
		height: 100%;
		overflow: auto;
	}
</style>
